<template>
  <div class="area">
    <div class="top">
      <img src="@/assets/images/logo2.png" class="col-6" alt="" />
      <h1>学员管理系统</h1>
    </div>
    <div class="row">
      <div class="left">
        <img src="@/assets/images/slogan.png" alt="" />
      </div>
      <div class="form-box">
        <div class="register box">
          <div class="container row header mb-4">
            <h2>欢迎注册</h2>
          </div>
          <form
            action=""
            class="container"
            autocomplete="off"
            @submit.prevent="onSubmit"
          >
            <!-- 账号 -->
            <div class="row mb-4 form-group">
              <span class="iconfont icon-yonghu"></span>
              <input
                type="text"
                class="form-control"
                name="username"
                v-model="username"
              />
            </div>
            <!-- 密码 -->
            <div class="row mb-4 form-group">
              <span class="iconfont icon-mima"></span>
              <input
                type="password"
                class="form-control"
                name="password"
                placeholder=""
                v-model="password"
              />
            </div>
            <div class="row mb-4">
              <button type="submit" class="btn btn-primary">注册</button>
            </div>
            <div class="row mb-3">
              <router-link to="/login">已有账号，去登录</router-link>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</template>
  
  <script>
import "bootstrap/dist/css/bootstrap.min.css";
import { registerAPI } from "@/api/user";
export default {
  data() {
    return {
      username: "value_user",
      password: "123456",
    };
  },
  methods: {
    async onSubmit(value) {
      const res = await registerAPI({
        username: this.username,
        password: this.password,
      });
      // console.log(res);
      if (res.data.code === 0) {
        this.$toast.success(res.data.message);
        this.$router.push("/login");
      } else if (res.data.code === 1) {
        this.$toast.fail({ message: res.data.message, icon: "like-o" });
      }
    },
  },
};
</script>
  
  <style lang="less" scoped>
</style>